<template>
  <div class="app-container">

    <IntroduceTip :value="5"></IntroduceTip>

    <div class="custom_card">
      <Tabs
        :list="tabs_list1"
        :column="7"
        :minWidth="200"
        :active="queryParams.type"
        @tabs_click="carBillsTypeChange"
        calss="menuTabs"
      ></Tabs>
    </div>
    <div class="custom_card_0">
      <MenuTabs
        v-if="queryParams.type == 1"
        key="MenuTabs2"
        :list="tabs_list2"
        name="业务类型"
        :labelWidth="100"
        :active="queryParams.typeDays"
        @tabs_click="carBillsDaysTypeChange"
      ></MenuTabs>
      <MenuTabs
        key="MenuTabs3"
        v-if="queryParams.type == 2"
        :list="tabs_list3"
        name="业务类型"
        :labelWidth="100"
        :active="queryParams.typeDays"
        @tabs_click="carBillsDaysTypeChange"
      ></MenuTabs>
      <MenuTabs
        key="MenuTabs4"
        v-if="queryParams.type == 3"
        :list="tabs_list4"
        name="业务类型"
        :labelWidth="100"
        :active="queryParams.typeDays"
        @tabs_click="carBillsDaysTypeChange"
      ></MenuTabs>
      <MenuTabs
        key="MenuTabs5"
        v-if="queryParams.type == 4"
        :list="tabs_list5"
        name="业务类型1"
        :labelWidth="100"
        :active="queryParams.typeDays"
        @tabs_click="carBillsDaysTypeChange"
      ></MenuTabs>
    </div>

    <div class="custom_card_0" v-show="showSearch">
      <el-form
        :model="queryParams"
        ref="queryForm"
        :inline="true"
        label-width="68px"
      >
        <el-form-item label="经办人" prop="createBy">
          <el-select
            v-model="queryParams.createBy"
            placeholder="请选择经办人"
            clearable
            size="small"
          >
            <el-option
              v-for="user in sysUserList"
              :key="parseInt(user.userId)"
              :label="user.userName"
              :value="parseInt(user.userId)"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="车牌号" prop="carNo">
          <el-input
            v-model="queryParams.carNo"
            placeholder="请输入车牌号"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="账单时间" prop="time">
          <el-date-picker
            clearable
            size="small"
            v-model="queryParams.time"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            placeholder="选择账单时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item
          label="业务类型"
          prop="bizType"
          v-if="queryParams.type == 3"
        >
          <el-select
            v-model="queryParams.bizType"
            placeholder="请选择业务类型"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in dict.type.pay_biz_type"
              v-if="filterDict(parseInt(dict.value))"
              :key="parseInt(dict.value)"
              :label="dict.label"
              :value="parseInt(dict.value)"
            />
          </el-select>
        </el-form-item>
        <el-form-item
          label="已付类型"
          prop="bizType"
          v-if="queryParams.type == 4 "
        >
          <el-select
            v-model="queryParams.bizType"
            placeholder="请选择已付类型"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in dict.type.pay_biz_type"
              v-if="filterDict(parseInt(dict.value))"
              :key="parseInt(dict.value)"
              :label="dict.label"
              :value="parseInt(dict.value)"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="warning"
            plain
            icon="el-icon-download"
            size="mini"
            :loading="exportLoading"
            @click="handleExport"
          >导出</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-tooltip placement="top" effect="dark">
            <div slot="content" style="font-size: 16px">
              车辆处置、维修、保养、保险、年检、违章、分期付款产生的收支情况。在车辆模块进行相应操作后，费用将同步到此模块
            </div>
            <el-button type="text">功能说明&nbsp;<i class="el-icon-warning-outline"></i></el-button>
          </el-tooltip>
        </el-form-item>
      </el-form>
    </div>
    <div class="custom_card">
<!--      <span style="color: #2251c5">合计:{{totalCount}}元</span>-->
      <el-table v-loading="loading" :data="financialList" border>
        <el-table-column
          label="账单时间"
          align="center"
          prop="payableTime"
          min-width="160"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          label="业务类型"
          align="center"
          prop="bizType"
          min-width="140"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <dict-tag
              :options="dict.type.pay_biz_type"
              :value="scope.row.bizType"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="车牌号"
          align="center"
          prop="carNo"
          min-width="140"
          show-overflow-tooltip
        />
        <el-table-column
          label="账单金额"
          align="center"
          prop="payableAmount"
          min-width="140"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            ¥{{ scope.row.payableAmount }}
          </template>
        </el-table-column>
        <el-table-column
          label="归属门店"
          align="center"
          prop="belongingStoreName"
          min-width="140"
          show-overflow-tooltip
        />
        <el-table-column
          label="经办人"
          align="center"
          prop="userName"
          min-width="140"
          show-overflow-tooltip
        />
        <el-table-column
          label="支付时间"
          align="center"
          prop="payTime"
          min-width="160"
          show-overflow-tooltip
          v-if="queryParams.type == 2 || queryParams.type == 4"
        >
          <template slot-scope="scope">
            {{ scope.row.payTime }}
          </template>
        </el-table-column>
        <el-table-column
          label="支付金额"
          align="center"
          prop="payAmount"
          min-width="140"
          show-overflow-tooltip
          v-if="queryParams.type == 2 || queryParams.type == 4"
        >
          <template slot-scope="scope"> ¥{{ scope.row.payAmount }} </template>
        </el-table-column>
        <el-table-column
          label="财务状态"
          align="center"
          prop="settlementStatus"
          min-width="140"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <dict-tag
              v-if="queryParams.type == 1 || queryParams.type == 2"
              :options="dict.type.settlement_Receive_status"
              :value="scope.row.settlementStatus"
            />
            <dict-tag
              v-if="queryParams.type == 3 || queryParams.type == 4"
              :options="dict.type.settlement_status"
              :value="scope.row.settlementStatus"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="支付方式"
          align="center"
          prop="payWay"
          v-if="queryParams.type == 2 || queryParams.type == 4"
          min-width="140"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <dict-tag
              :options="dict.type.sys_pay_way"
              :value="scope.row.payWay"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          fixed="left"
          align="center"
          class-name="small-padding fixed-width"
          width="180"
        >
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              v-if="scope.row.settlementStatus != 1"
              @click="handleDetails(scope.row)"
              >费用明细</el-button
            >
            <el-button
              size="mini"
              type="text"
              v-hasPermi="['bills:carBills:receiveMoney']"
              v-if="scope.row.settlementStatus != 3 && queryParams.type == 3"
              @click="handleUpdate(scope.row)"
              >确认付款</el-button
            >
            <el-button
              size="mini"
              type="text"
              v-hasPermi="['bills:carBills:receiveMoney']"
              v-if="scope.row.settlementStatus != 3 && queryParams.type == 1"
              @click="handleUpdate(scope.row)"
              >确认收款</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>

    <!-- 确认收款 -->
    <el-dialog
      :title="openTitle"
      :visible.sync="open"
      append-to-body
      :close-on-click-modal="false"
      width="700px"
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="90px">
        <el-row>
          <el-col :span="12" v-for="(item ,index) in form.costDescriptionList" :key="index">
            <el-form-item :label="item.name">
              {{item.value}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="账单时间" prop="payableTime">
              <el-input
                v-model="form.payableTime"
                style="width: 100%"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="账单金额" prop="payableAmount">
              <el-input
                v-model="form.payableAmount"
                style="width: 100%"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付方式" prop="payWay">
              <el-select
                v-model="form.payWay"
                placeholder="请选择支付方式"
                style="width: 100%"
                clearable
                size="small"
              >
                <el-option
                  v-for="dict in dict.type.sys_pay_way"
                  v-if="parseInt(dict.value) != 5"
                  :key="parseInt(dict.value)"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付时间" prop="payTime">
              <el-date-picker
                clearable
                size="small"
                v-model="form.payTime"
                style="width: 100%"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                placeholder="选择支付时间"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付金额" prop="payAmount">
              <el-input
                v-model.number="form.payAmount"
                placeholder="请输入支付金额"
                maxlength="10"
                show-word-limit
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="支付凭证">
              <ImageUpload
                @on-success="costImageSuccess"
                v-model="form.costImage"
                :limit="6"
                @on-remove="costImageRemove"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="备注" prop="remark">
              <el-input
                v-model="form.remark"
                type="textarea"
                placeholder="请输入内容"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" :loading="submitLoading"
          >确 定</el-button
        >
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!--  费用明细  -->
    <el-dialog title="费用明细" :visible.sync="openDetails" append-to-body>
      <el-row>
        <el-col :span="24">
          <el-descriptions
            :column="2"
            border
            :labelStyle="{ width: '100px' }"
            :contentStyle="{ width: '300px' }"
          >
            <el-descriptions-item  v-for="(item ,index) in formDetails.costDescriptionList" :key="index">
              <template slot="label">{{item.name}}</template>
              {{item.value}}
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">业务类型</template>
              <dict-tag
                :options="dict.type.pay_biz_type"
                :value="formDetails.bizType"
              />
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">账单类型</template>
              <dict-tag
                :options="dict.type.bill_type"
                :value="formDetails.billType"
              />
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">应付时间</template>
              {{
                parseTime(formDetails.payableTime, '{y}-{m}-{d} {h}:{i}:{s}')
              }}
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">应付金额</template>
              {{ formDetails.payableAmount }}
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">支付时间</template>
              {{ parseTime(formDetails.payTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">支付金额</template>
              {{ formDetails.payAmount }}
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">财务状态</template>
              <dict-tag
                v-if="formDetails.billType == 1"
                :options="dict.type.settlement_Receive_status"
                :value="formDetails.settlementStatus"
              />
              <dict-tag
                v-if="formDetails.billType == 2"
                :options="dict.type.settlement_status"
                :value="formDetails.settlementStatus"
              />
            </el-descriptions-item>
            <el-descriptions-item >
              <template slot="label">支付方式</template>
              <dict-tag
                :options="dict.type.sys_pay_way"
                :value="formDetails.payWay"
              />
            </el-descriptions-item>
            <el-descriptions-item  :span="2">
              <template slot="label">备注</template>
              {{ formDetails.remark }}
            </el-descriptions-item>
            <el-descriptions-item  :span="2">
              <template slot="label">支付凭证</template>
              <el-image
                v-for="(item, index) in formDetails.urlList"
                :key="index"
                :src="getImgUrl(item)"
                :preview-src-list="[getImgUrl(item)]"
                style="width: 20%; margin-right: 15px"
                fit="contain"
              ></el-image>
            </el-descriptions-item>
          </el-descriptions>
        </el-col>
      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancelDetails">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {
    listFinancial,
    getFinancial,
    receiveMoney,
    addFinancial,
    exportFinancial,
    selectBillFinancialCount, selectBillFinancialCount1,
  } from '@/api/bills/financial'
import { userlist } from '@/api/system/user'
import Tabs from '@/components/custom/tabs.vue'
import MenuTabs from '@/components/custom/menuTabs.vue'
import { number } from 'echarts/core'
export default {
  name: 'CarBills',
  dicts: [
    'sys_pay_way',
    'settlement_way',
    'secondments_state',
    'settlement_status',
    'settlement_Receive_status',
    'pay_biz_type',
    'bill_type',
  ],
  data() {
    return {
      showTip:true,
      totalCount:0,
      // 遮罩层
      loading: true,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      openTitle:'财务收款',
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 财务账单表格数据
      financialList: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        bizType: null,
        bizNo: null,
        billType: null,
        payableTime: null,
        payableAmount: null,
        payTime: null,
        payAmount: null,
        settlementStatus: null,
        payWay: null,
        deptId: null,
        carNo: null,
        tenantId: null,
        time: null,
        startTime: null,
        endTime: null,
        createBy: null,
        type: 1,
        typeDays: 1,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        payWay: [
          { required: true, message: '支付方式不能为空', trigger: 'blur' },
        ],
        payTime: [
          { required: true, message: '支付时间不能为空', trigger: 'blur' },
        ],
        payAmount: [
          { required: true, message: '支出费用不能为空', trigger: 'change' },
          {
            pattern: /^(([1-9][0-9]*)|(([0]\.\d{0,2}|[1-9][0-9]*\.\d{0,2})))$/,
            message: '费用输入有误',
            trigger: 'blur',
          },
        ],
      },
      //经办人
      sysUserList: [],
      openDetails: false,
      formDetails: {},
      tabs_list1: [
        { key: '1', name: '应收账单', count: '￥0' },
        { key: '2', name: '已收账单', count: '￥0' },
        { key: '3', name: '应退账单', count: '￥0' },
        { key: '4', name: '已退账单', count: '￥0' },
      ],
      tabs_list2: [
        { key: '1', name: '全部', count: '￥0' },
        { key: '2', name: '今日', count: '￥0' },
        { key: '3', name: '本周', count: '￥0' },
        { key: '4', name: '本月', count: '￥0' },
      ],
      tabs_list3: [
        { key: '1', name: '全部', count: '￥0' },
        { key: '2', name: '今日', count: '￥0' },
        { key: '3', name: '本周', count: '￥0' },
        { key: '4', name: '本月', count: '￥0' },
      ],
      tabs_list4: [
        { key: '1', name: '全部', count: '￥0' },
        { key: '6', name: '今日', count: '￥0' },
        { key: '7', name: '本周', count: '￥0' },
        { key: '8', name: '本月', count: '￥0' },
      ],
      tabs_list5: [
        { key: '5', name: '全部', count: '￥0' },
        { key: '6', name: '今日', count: '￥0' },
        { key: '7', name: '本周', count: '￥0' },
        { key: '8', name: '本月', count: '￥0' },
      ],
      maxAmount: 0,
      submitLoading: false,
    }
  },
  components: {
    Tabs,
    MenuTabs,
  },
  created() {
    this.carBillsTypeChange(1)
    this.getUserList()
    this.getSelectBillFinancialCount();
  },
  activated() {
    this.getList();
  },
  methods: {
    closeTip(){
      this.showTip = false;
    },
    cancelDetails() {
      this.openDetails = false
    },
    // 删除图片
    costImageRemove(file) {
      this.form.costImage = null
    },
    // 上传成功回调
    costImageSuccess(res) {
      this.form.costImage = res.fileName
      this.$refs['form'].validateField('costImage')
    },
    //统计
    getSelectBillFinancialCount1() {
      selectBillFinancialCount1(this.queryParams).then((response) => {
        let carBill = response.data
        if(this.queryParams.type==1){
          this.tabs_list2 = [
            { key: '1', name: '全部', count: '￥' + carBill.receivable },
            { key: '2', name: '今日', count: '￥' + carBill.receivableDay },
            { key: '3', name: '本周', count: '￥' + carBill.receivableWeeks },
            { key: '4', name: '本月', count: '￥' + carBill.receivableMonth },
          ]
        }
        if(this.queryParams.type==2){
          this.tabs_list3 = [
            { key: '1', name: '全部', count: '￥' + carBill.toReceive },
            { key: '2', name: '今日', count: '￥' + carBill.toReceiveDay },
            { key: '3', name: '本周', count: '￥' + carBill.toReceiveWeeks },
            { key: '4', name: '本月', count: '￥' + carBill.toReceiveMonth },
          ]
        }
        if(this.queryParams.type==3){
          this.tabs_list4 = [
            { key: '1', name: '全部', count: '￥' + carBill.payable },
            { key: '6', name: '今日', count: '￥' + carBill.payableDay },
            { key: '7', name: '本周', count: '￥' + carBill.payableWeeks },
            { key: '8', name: '本月', count: '￥' + carBill.payableMonth },
          ]
        }
        if(this.queryParams.type==4){
          this.tabs_list5 = [
            { key: '5', name: '全部', count: '￥' + carBill.toPayable },
            { key: '6', name: '今日', count: '￥' + carBill.toPayableDay },
            { key: '7', name: '本周', count: '￥' + carBill.toPayableWeeks },
            { key: '8', name: '本月', count: '￥' + carBill.toPayableMonth },
          ]
        }
      })
    },
    getSelectBillFinancialCount() {
      selectBillFinancialCount(this.queryParams).then((response) => {
        let carBill = response.data
        this.tabs_list1 = [
          { key: '1', name: '应 收 账 单', count: '￥' + carBill.receivable },
          { key: '2', name: '已 收 账 单', count: '￥' + carBill.toReceive },
          { key: '3', name: '应 付 账 单', count: '￥' + carBill.payable },
          { key: '4', name: '已 付 账 单', count: '￥' + carBill.toPayable },
        ]
        this.tabs_list2 = [
          { key: '1', name: '全部', count: '￥' + carBill.receivable },
          { key: '2', name: '今日', count: '￥' + carBill.receivableDay },
          { key: '3', name: '本周', count: '￥' + carBill.receivableWeeks },
          { key: '4', name: '本月', count: '￥' + carBill.receivableMonth },
        ]
        this.tabs_list3 = [
          { key: '1', name: '全部', count: '￥' + carBill.toReceive },
          { key: '2', name: '今日', count: '￥' + carBill.toReceiveDay },
          { key: '3', name: '本周', count: '￥' + carBill.toReceiveWeeks },
          { key: '4', name: '本月', count: '￥' + carBill.toReceiveMonth },
        ]
        this.tabs_list4 = [
          { key: '1', name: '全部', count: '￥' + carBill.payable },
          { key: '6', name: '今日', count: '￥' + carBill.payableDay },
          { key: '7', name: '本周', count: '￥' + carBill.payableWeeks },
          { key: '8', name: '本月', count: '￥' + carBill.payableMonth },
        ]
        this.tabs_list5 = [
          { key: '5', name: '全部', count: '￥' + carBill.toPayable },
          { key: '6', name: '今日', count: '￥' + carBill.toPayableDay },
          { key: '7', name: '本周', count: '￥' + carBill.toPayableWeeks },
          { key: '8', name: '本月', count: '￥' + carBill.toPayableMonth },
        ]
      })
    },
    //过滤字典
    filterDict(val) {
      return (
        val != 1 &&
        val != 2 &&
        val != 3 &&
        val != 9 &&
        val != 11 &&
        val != 12 &&
        val != 13 &&
        val != 14 &&
        val != 15 &&
        val != 16
      )
    },
    //经办人
    getUserList() {
      userlist({}).then((response) => {
        this.sysUserList = response.data
      })
    },
    carBillsTypeChange(val) {
      this.resetForm('queryForm')
      this.queryParams.time = ''
      this.queryParams.startTime = null
      this.queryParams.endTime = null
      this.queryParams.type = val
      if (this.queryParams.type == '4') {
        this.queryParams.typeDays = '5'
      } else {
        this.queryParams.typeDays = '1'
      }
      this.getList()
    },
    //子统计
    carBillsDaysTypeChange(val) {
      this.queryParams.pageNum = 1
      this.queryParams.typeDays = val
      this.getList()
    },
    /** 查询财务账单列表 */
    getList() {
      this.loading = true
      this.getSelectBillFinancialCount1();
      listFinancial(this.queryParams).then((response) => {
        this.financialList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        bizType: null,
        bizNo: null,
        billType: null,
        payableTime: null,
        payableAmount: null,
        payTime: null,
        payAmount: null,
        settlementStatus: 0,
        payWay: null,
        deptId: null,
        tenantId: null,
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        remark: null,
        costImage: null,
        urlList: [],
      }
      this.resetForm('form')
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      if (this.queryParams.time) {
        this.queryParams.startTime = this.parseTime(
          this.queryParams.time[0],
          '{y}-{m}-{d} {h}:{i}:{s}'
        )
        this.queryParams.endTime = this.parseTime(
          this.queryParams.time[1],
          '{y}-{m}-{d} {h}:{i}:{s}'
        )
      }
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.queryParams.time = ''
      this.queryParams.startTime = null
      this.queryParams.endTime = null
      this.handleQuery()
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset()
      this.open = true
      this.title = '添加财务账单'
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset()
      const id = row.id || this.ids
      getFinancial(id).then((response) => {
        this.form = response.data
        if (this.form.payAmount == null) {
          this.form.payAmount = 0
        }
        this.form.payAmount = this.form.payableAmount - this.form.payAmount
        this.form.payAmount = this.form.payAmount < 0 ? 0 : this.form.payAmount
        this.maxAmount = this.form.payAmount
        this.form.payAmount = parseFloat(this.form.payAmount).toFixed(2)
        this.form.payTime = this.parseTime(
          new Date(),
          '{y}-{m}-{d} {h}:{i}:{s}'
        )
        this.form.urlList = []
        this.open = true
        if(this.queryParams.type == 1 ){
          this.openTitle = '财务收款'
        }
        if(this.queryParams.type == 3 ){
          this.openTitle = '财务付款'
        }
        this.title = '修改财务账单'
      })
    },
    //账单详情
    handleDetails(row) {
      this.openDetails = true
      getFinancial(row.id).then((response) => {
        this.formDetails = response.data
      })
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          const  payableAmount = Number(this.form.payableAmount);
          const  payAmount = Number(this.form.payAmount);
          if (payAmount>payableAmount){
            this.$message({
              message:'支付金额不能大于账单金额'
            })
            return
          }
          this.submitLoading = true
          if (this.form.costImage) {
            this.form.urlList = this.form.costImage.split(',')
          }
          if (this.form.id != null) {
            receiveMoney(this.form)
              .then((response) => {
                this.$modal.msgSuccess('收款成功')
                this.open = false
                //this.carBillsTypeChange(1);
                this.getSelectBillFinancialCount()
                this.getList()
                this.submitLoading = false
              })
              .catch((item) => {
                this.submitLoading = false
              })
          } else {
            addFinancial(this.form).then((response) => {
              this.$modal.msgSuccess('新增成功')
              this.open = false
              this.carBillsTypeChange(1)
              this.submitLoading = false
            })
          }
        }
      })
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams
      this.$modal
        .confirm('是否确认导出所有财务账单数据项？')
        .then(() => {
          this.exportLoading = true
          return exportFinancial(queryParams)
        })
        .then((response) => {
          this.$download.name(response.msg)
          this.exportLoading = false
        })
        .catch(() => {})
    },
  },
}
</script>
